import { useState, useEffect } from "react";
import { resourcePath } from "../../../../../../../utils/resource";
import { Button, Table } from "antd";

import { CloseOutlined } from "@ant-design/icons";
import CztApi from "../../../../../../../utils/apis/CztApi";
export default function CsfxXq(props) {
    const { result, csfx, geomCs, onUpdateXqList } = props;

    const [datas, setDatas] = useState();
    const handleClick = (record) => {
        onUpdateXqList(record)
    }


    useState(() => {
        CztApi.zzfxxq(geomCs, csfx).then(resp => {
            setDatas(resp.data)
        })

    }, [csfx, geomCs])
    return <div style={{
        width: 350,
        position: "absolute",
        right: 30,
        top: 30,
        bottom: 30,
        background: 'rgba(1,15,31,0.5)',
        // border: '1px solid rgba(9,107,225,0.8)',
        pointerEvents: 'auto',
        overflow: "auto",
        borderRadius: 8
    }} className="layout-v">
        <div style={{
            fontSize: 20,
            fontWeight: "bold",
            marginBottom: 12
        }} className='layout-h center'>
            <div className='fill w0'>
                <div style={{
                    background: `url(${resourcePath.blockTitleBg})`,
                    height: 36,
                    backgroundSize: '100% 100%',
                    fontSize: 18,
                    lineHeight: '36px',
                    paddingLeft: 12,
                    fontWeight: "bold",
                    overflow: "hidden"
                }}
                >
                    {csfx}
                </div>
            </div>
            <div>
                <Button size="small" icon={<CloseOutlined />} style={{
                    // color: "#fff"
                }} onClick={e => {
                    props.onClose?.()
                }} />
            </div>
        </div>

        <Table style={{ marginTop: 10 }}
            columns={[
                {
                    title: '名称',
                    dataIndex: 'yhmc'
                },
                {
                    width: 80,
                    align: 'center',
                    render: (ext, record) => {
                        return <Button type="link" size="small"
                            onClick={e => handleClick(record)}
                        >详情</Button>
                    }

                }
            ]}
            dataSource={datas} />
    </div>
}